<template>
<div>
  <el-table
      :data="articles"
      border
      style="width: 100%">
    <el-table-column
        prop="id"
        label="id"
        width="100">
    </el-table-column>
    <el-table-column
        prop="title"
        label="标题"
        >
      <template slot-scope="scope">
        <el-link @click="$router.push('/article/'+scope.row.id)">{{scope.row.title}}</el-link>
      </template>
    </el-table-column>
    <el-table-column
        prop="createTime"
        label="发布时间"
        width="180">
    </el-table-column>
    <el-table-column
        label="状态">
      <template slot-scope="scope">
        <span v-if="scope.row.status==1">禁用</span>
        <span v-if="scope.row.status==0">启用</span>
      </template>
    </el-table-column>
    <el-table-column
        fixed="right"
        label="操作"
        width="100">
      <template slot-scope="scope">
        <el-button type="text" v-if="scope.row.status==0" @click="enable(scope.row, 1)" >禁用</el-button>
        <el-button type="text" v-if="scope.row.status==1" @click="enable(scope.row, 0)" >启用</el-button>
      </template>
    </el-table-column>
  </el-table>
</div>
</template>

<script>
export default {
  name: "ArticleInfo",
  data(){
    return{
      articles:[],
    }
  },
  methods:{
    enable(val, status){
      let param = {
        articleId: val.id,
        status: status
      }
      this.getRequest('/article/enable',param).then(()=>{
        this.getUsers()
      })
    },
    getArticles(){
      this.getRequest('/article/getAll').then(resp=>{
        this.articles = resp.data
      })
    }
  },
  created() {
    this.getArticles()
  }
}
</script>

<style scoped>

</style>